<!-- 08使用场景
    1.用户的登录、注册和搜索页面
    2.使用频率低
 -->

<!-- 09input基本使用
    标签:
    input type="各种属性"
    属性:
    1.text(单行文本框)
    2.password(密码框,输入的内容会被*代替)
    3.radio(单选框)
    4.checkbox(多选框)
    5.file(文件上传)
 -->

<!-- 10占位符palceholder
    解释
    1.为属性，写在type后
    2.palceholder="提示信息"
    3.radio、checkbox、file没有placeholder属性
 -->

 <!-- 11单选功能和默认选中
    属性
    1.name="同组名"(同组内只能选一个，真正实现单选功能)
    2.checked(默认选中，只能写在单选框或多选框中，只能写在一个单选框中，写在哪个就默认选中哪个)
    
    多选功能和默认选中
    属性
    1.name="同组名"(同组内可以选多个，真正实现多选功能)
    2.checked(默认选中，只能写在单选框或多选框中，写在哪个就默认选中哪个)
 -->

 <!-- 12多文件上传
    语法
    type="file" multiple(多文件上传)
 -->

<!-- 13按钮input
    标签
    <form action="提交给的地址">表单中的元素，包含按钮、文本框、密码框、单选框、多选框、文件上传、提交按钮、重置按钮</form>
    属性
    1.type="submit"(提交按钮,默认value="提交",必须写在form中才能提交)
    2.type="reset"(重置按钮,默认value="重置"，必须写在form中才能重置)
    3.type="button"(自定义按钮,用js加功能)
    4.value="自定义按钮内容"
-->

<!-- 14按钮button
    1.标签
    <button>按钮的名字</button>
    2.属性
    1.type="submit"(提交按钮,默认value="提交",必须写在form中才能提交)
    2.type="reset"(重置按钮,默认value="重置"，必须写在form中才能重置)
    3.type="button"(自定义按钮,用js加功能)
-->

<!-- 15下拉菜单
    1.标签
    <select>(做下拉菜单的外层框架，类似于table)
    <option value="值">选项1</option>（做下拉菜单的内容，类tr/td）
    2.属性
    selected(默认选中)
    -->

<!-- 16文本域
    标签
    <textarea></textarea>（作用参考朋友圈的文本框）
    属性
    1.name="名字"
    2.cols="列数"（宽度，一般在css里设置）
    3.rows="行数"（高度，一般在css里设置）
    4.placeholder="提示信息"
-->

<!-- 17label标签
    作用
    让单选框和多选框更方便的使用（可以点字来勾选）
    语法
    法1.<label for="id">文本</label> （for属性的值要和input的id属性的值相同）
    法2.<label><input type="radio" name="gender">男</label>(在单选框外面加label标签，label中不写for属性)
-->

 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
 </head>
 <body>
    <form action="">
    <!-- text -->
     单行文本框:
     <input type="text" placeholder="请输入用户名">
     <br>
     <br>

     密码框:
     <input type="password" name="" id="" placeholder="请输入密码">
     <br>
     <br>

     单选框:
     请输入您的性别： <input type="radio" name="gender" id=""  checked>男  <input type="radio" name="gender" id="">女
     <br>
     <br>

     多选框:
     若同意此协议，请勾选：<input type="checkbox" name="" id="" checked>
     <br>
     <br>

     文件上传:
     <input type="file" name="" id="" multiple>
     <br>
     <br>

     提交按钮:
     <input type="submit" value="全部提交">
     <br>
     <br>

     重置按钮:
     <input type="reset" value="全部重置">
     <br>
     <br>

     自定义按钮:
     <input type="button" value="普通按钮">
     <br>
     <br>

    button提交按钮:
    <button type="submit">提交按钮</button>
    <br>
    <br>

    button重置按钮:
    <button type="reset">重置按钮</button>
    <br>
    <br>

    button自定义按钮:
    <button type="button">自定义按钮</button>
    <br>
    <br>
    </form>

    下拉菜单:
    <select name="" id="">
        <option value="">北京</option>
        <option value="">上海</option>
        <option value="">广州</option>
        <option value="">深圳</option>
        <option value="">杭州</option>
        <option value="" selected>成都</option>
    </select>
    <br>
    <br>

    文本域:
    <textarea name="" id="" placeholder="请在此分享您志愿填报的心路历程"></textarea>
    <br>
    <br>

    label标签:
    <input type="radio" name="gender" id="man"> <label for="man">男</label>
    <label><input type="radio" name="gender"> 女</label>
    
 </body>
 </html>